@using StudentVideo.Client.Common.Constants;
@using StudentVideo.Client.Components.CuIcon;

@typeparam TItem

<div class="cu_tabs_main @Class">
   @foreach (var item in Items)
   {
      var key = ItemKey(item);
      <div class="tab_item @(key == ActiveId ? "tab_item_active" : "") @ItemClass" id="@key" @onclick="e => ItemClick(item)">
         <span class="label">@ItemName(item)</span>

         @if (RemoveButton && Items.Count > 1)
         {
            <span class="remove" @onclick:stopPropagation="true" @onclick="e => RemoveClick(item)">
               <CuIcon class="remove_icon" IconType="@CuIconEnum.CloseSmall" Square="20" />
            </span>
         }
      </div>
   }

   <div class="line" style="left: @(MarkLeft)px; width: @(MarkWidth)px;"></div>
</div>
